<!-- 相当于给模板定义一个名字 define end 成对出现 -->
 {{ define "frontdesk/goodsInfo.html" }}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>天猫商城</title>
    <link rel="stylesheet" href="/static/css/base.css">
    <link rel="shortcut icon" href="/static/images/tianmao.jpg" type="image/x-icon">

    <style>
        .all{
            margin: 20px;
            display: flex;
            justify-content: center;
            align-items: center;
            .det-title{
                color: rgb(250, 141, 7);
                font-weight: bold;
                font-size: 18px;
                margin-bottom: 10px;
                text-align: center;
            }
            .top-part{
                padding: 20px;
                background-color: rgb(242, 233, 222);
                display: flex;
                justify-content: center;
                align-items: center;
                .img{
                    width: 400px;
                    height: 400px;
                    margin-bottom: 10px;
                }
                .name{
                    color: rgb(38, 147, 150);
                    font-weight: bold;
                }
            }
            .bot-part{
                margin-top: 30px;
                text-align: center;
                .back{
                    /* cursor: pointer; */
                    padding: 8px;
                    border-radius: 10px;
                    background-color: green;
                    color: white;
                }
                .point-ck{
                    cursor: pointer;
                }
                .btn-mg{
                    margin-right: 50px;
                }
            }
        }
    </style>
</head>
<body>
    {{template "public/page_header.html" .}}
    
    <div class="all">
        <div>
            <div class="det-title">商品详情</div>
            <div class="top-part">
                <div>
                    {{if ne .info.ImgPath ""}}
                        <img class="img" src="/static/upload/goods/{{.info.ImgPath}}" alt="">
                    {{end}}
                    <div><span>名称：</span><span class="name">{{.info.Title}}</span></div>
                    <div>
                        <span>类别：</span>
                        {{if eq .info.Category 1}}
                            水果
                        {{else if eq .info.Category 2}}
                            鲜花
                        {{else if eq .info.Category 3}}
                            蔬菜
                        {{else if eq .info.Category 4}}
                            休闲零食
                        {{else}}
                            酒水饮料
                        {{end}}
                    </div>
                    <div><span>单价：￥</span>{{.info.Price}}</div>
                    <div><span>剩余数量：</span>{{.info.Number}}</div>
                    <div><span>商品内容：</span>{{.info.Content}}</div>
                </div>
            </div>
            <div class="bot-part">
                <span class="back btn-mg" onclick="addCard()">加入购物车</span>
                <span class="back point-ck" onclick="back()">返回</span>
            </div>
        </div>
    </div>

    <br>
    {{template "public/page_footer.html" .}}

    <script>
        function addCard(){
            
        }
        function back() {
            location.href="/front/index";
        }
    </script>
</body>
</html>
{{ end }}